<template>
    <el-tooltip class="item" content="复制" placement="bottom">
        <template #default>
            <el-button text class="btn--info-id--copy" @click="copy" >
                复制
            </el-button>
        </template>
    </el-tooltip>
</template>

<script>
    import ClipboardJS from 'clipboard'
    import { ElMessage } from 'element-plus'
    export default {
        props: [ "str"],
        data() {
            return {}
        },
        methods: {
            copy () {
                var clipboard = new ClipboardJS('.btn--info-id--copy', {
                    text: () => {
                        return this.str;
                    }
                });
                clipboard.on('success', () => {
                    ElMessage({
                        message: '复制成功',
                        type: 'success',
                        showClose: true,
                        duration: 3 * 1000
                    })
                    clipboard.destroy()
                })
            }
        }

    }
</script>